<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ page import="com.augmentum.oes.util.PathUtil" %>
<%@ page import="com.augmentum.oes.util.PropertyUtil" %>
<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>upload</title>
<link rel="stylesheet" href="<%=PropertyUtil.getStaticPath() %>/static/css/main.css" type="text/css" />
<script src="<%=PropertyUtil.getStaticPath() %>/static/js/jquery-1.10.2.min.js"></script>
<script src="<%=PropertyUtil.getStaticPath() %>/static/js/dialog.js"></script>
<script src="<%=PropertyUtil.getStaticPath() %>/static/js/user.js"></script>
</head>
<body>
    <div style="width:600px;height:450px;margin:auto auto; left: 0;right: 0;top: 0;bottom: 0;position:fixed;">
        <div style="text-align:center;width:200px;height:160px;border:1px solid #0A0A0A;margin:130px auto;">
            <img style="margin:9px auto;" <c:if test="${!empty fileUrl}">src="${fileUrl}"</c:if> <c:if test="${empty fileUrl}">src=<%=PropertyUtil.getStaticPath() %>/avera_image/${user.photoPath} </c:if>width="130px" height="140px" />
        </div>
        <form id="uploadForm"  action="<%=PathUtil.getFullPath("uploadimg.action") %>" name="myform" method="post" enctype="multipart/form-data">
        <input id="uploadfile" style="display:none;" type="file" name="file" onchange="CheckFile(this);" /> 
        <div style="margin:-110px auto;width:350px;">
        <div class="add-photo-button" onmouseout="this.className='add-photo-button'" onmouseover="this.className='add-photo-button-over'" style="float:left;" onclick="showFile();" style="float:left;" > Add a photo </div>
        <div class="upload-photo-button" onmouseout="this.className='upload-photo-button'" onmouseover="this.className='upload-photo-button-over'" style="float:left;" <c:if test="${empty fileUrl}">onclick="noFile();"</c:if> <c:if test="${!empty fileUrl}">onclick="saveFile('${saveName}');"</c:if>  style="float:left;margin-left:20px;" > Set as my avater </div>
        </div>
        </form>
    </div>
    <div class="modal-dialog" id="modalDialog">
      <div onclick="modalDialogHidden();" title="Close Dialog" class="modal-dialog-closebutton">
      </div>
      <div class="modal-dialog-msg" id="msgContent">
      </div>
      <div class="modal-dialog-btn-outdiv">
        <div class="modal-btn modal-dialog-btn-yes single-button" onclick="modalDialogHidden();">OK</div>
      </div>
    </div>
    <div class="modal-dialog" id="confirmDialog">
      <div onclick="confirmHidden();" title="Close Dialog" class="modal-dialog-closebutton">
      </div>
      <div class="modal-dialog-msg" id="confirmContent">
      </div>
    <div class="modal-dialog-btn-outdiv">
        <div class="modal-btn modal-dialog-btn-yes" onclick="submitForm();">YES</div>
        <div class="modal-btn modal-dialog-btn-no" onclick="confirmHidden();">NO</div>
      </div>
    </div> 
</body>


</html>